Week 01
Introduction to UI/UX Design
Definition and differences between UI and UX
Importance of user-centered design
Overview of the UI/UX design process (Research, Design, Prototype, Test)
Week 02
Principles of Good Design
Design Thinking (Empathy, Define, Ideate, Prototype, Test)
Key principles: Visual hierarchy, consistency, and simplicity
Basic design terminology (grids, alignment, white space)
Week 03
Introduction to Color Theory and Typography
Basic principles of color combinations and contrasts
Typography: Fonts, readability, and UI consistency
Applying color and typography in UI/UX
Week 04
Introduction to Wireframing and Prototyping
Tools for wireframing (Figma, Adobe XD, Sketch)
Low-fidelity wireframes
Introduction to clickable prototypes
Week 05
Introduction to Photoshop
Overview of Photoshop interface and tools
Basic image editing techniques (cropping, resizing, layers)
Color adjustments and filters
Week 06
Photoshop for UI Design
Creating UI elements (buttons, icons)
Using shapes and layers for UI components
Exporting assets for design use
Week 07
Basic Illustration Techniques
Introduction to vector vs raster graphics
Creating simple illustrations using the Pen tool
Drawing shapes and icons
Week 07
Illustrator Basics
Vector illustrations for UI design
Creating scalable icons and graphics
Exporting assets for UI/UX design
Week 09
UI Design Best Practices
Components of a user interface (buttons, forms, navigation)
Layout design principles: Grid systems, spacing, and alignment
Designing for different devices (responsive design)
Week 10
Creating a Design System
Introduction to design systems
Building reusable components and UI patterns
Organizing design files for consistency
Week 11
Usability and Accessibility
What is usability and why it matters in design
Designing for accessibility: Color contrast, text size, and screen readers
Common accessibility tools for checking UI design
Week 12
User Testing and Feedback
Methods of usability testing (moderated vs unmoderated)
Gathering feedback from users
Iterating design based on user feedback
Week 13
High-Fidelity Prototyping
Transitioning from wireframes to high-fidelity designs
Adding interaction and animation in Figma/Adobe XD
Working with real-world constraints (time, budget, technical limitations)
Week 14
Designing for Mobile and Web
Best practices for designing mobile-first interfaces
Responsive web design principles
Adaptive vs responsive design: What’s the difference?
Week 15
Project Development
Start working on a capstone project:
Define the problem, research users, and create wireframes
Apply Photoshop and illustration techniques in project design
Week 16
Final Project Submission and Portfolio Development
Finalize your capstone project (high-fidelity prototype with usability testing results)
Build a portfolio showcasing UI/UX design work
Tips for building a personal website or uploading designs on Behance/Dribbble
